﻿@using proveKendo.Controllers
@model List<KendoSchedulerTask>

@section additionalCSS
{

}

@section additionalJS
{

}

<div id="team-schedule">
    <div id="people">
        <input checked type="checkbox" id="alex" value="1" />
        <input checked type="checkbox" id="bob" value="2" />
        <input type="checkbox" id="charlie" value="3" />
    </div>
</div>

@(Html.Kendo().Scheduler<KendoSchedulerTask>()
    //.Editable(false)
    .Name("scheduler")
    .StartTime(new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day, 9, 0, 0))
    //.Timezone("Etc/UTC")
    .Height(700)
    .DateHeaderTemplate("<span class='k-link k-nav-day'>#=kendo.toString(date, 'ddd dd/M')#</span>")
    .Messages(m => m.AllDay("tutto il giorno"))
    .Messages(m => m.Today("oggi"))
    .Messages(m => m.Views(a => a.Day("giorno")))
    .Messages(m => m.Views(a => a.Week("settimana")))
    .Messages(m => m.Views(a => a.Month("mese")))
    .Views(views =>
    {
        views.DayView();
        views.WeekView(weekView => weekView.Selected(true));
        views.MonthView();
        views.AgendaView();
    })

    .EventTemplate(
            "<div class='movie-template'>" +
                //"<img src='" + Url.Content("~/Content/web/scheduler/") + "#= Image #' />" +
                //"<p>" +
                //    "#= kendo.toString(start, 'hh:mm') # - #= kendo.toString(end, 'hh:mm') #" +
                //"</p>" +
                "<p class=\"testoEvento\">#= title #  <br/> #= description #</p>" +
                
                //"<a href='#= Imdb #'>Movie in IMDB</a>" +
    
            "</div>")
    
    .Resources(resource =>
    {
        //vecchio modo di colorare i task
        //resource.Add(m => m.IdMateria)
        //    .Title("Materia")
        //    .DataTextField("Text")
        //    .DataValueField("Value")
        //    .DataColorField("Color")
        //    .BindTo(new[] { 
        //        new { Text = "Analisi 1", Value = 1, Color = "#75663F" },
        //        new { Text = "Reti di calcolatori", Value = 2, Color = "#CD7F32" } 
        //    });
        

        //nuovo modo di colorare i task
        resource.Add(m => m.IdMateria)
                .Title("Materia")
                .DataTextField("Materia")
                .DataValueField("IdMateria")
                .DataColorField("Color")
                .DataSource(source => source
                    .Read(read => read.Action("GetColorList", "Scheduler")));

        
        resource.Add(m => m.RoomId)
            .Title("Room")
            .DataTextField("Text")
            .DataValueField("Value")
            .BindTo(new[] { 
                new { Text = "Aula A", Value = 1 },
                new { Text = "Aula B", Value = 2 } 
            });
    })
        
     .DataSource(d => d
        .Model(m =>
        {
            m.Id(f => f.TaskId);
            m.Field(f => f.Title).DefaultValue("Titolo");
            m.Field(f => f.IdInsegnante).DefaultValue(1);
            m.Field(f => f.Description).DefaultValue("Descrizione");
            m.Field(f => f.StartTimezone).DefaultValue("Etc/UTC");
            m.Field(f => f.EndTimezone).DefaultValue("Etc/UTC");
            m.Field(f => f.IdMateria);
            //m.RecurrenceId(f => f.RecurrenceID);
        })
        .Read("Read", "Scheduler")
        .Create("Create", "Scheduler")
        .Destroy(destroy => destroy.Action("Destroy", "Scheduler"))
        .Update(update => update.Action("Update", "Scheduler"))
        .Filter(filters => filters.Add(model => model.IdInsegnante).IsEqualTo(1).Or().IsEqualTo(2))
        .Events(events => events.Error("error"))
    )
)
      
<script type="text/javascript">
    //gestione degli eventuali errori tramite popup
    //si potrebbe fare meglio con una finestra modale
    function error(args) {
        if (args.errors) {

            var scheduler = $("#scheduler").data("kendoScheduler");
            scheduler.one("dataBinding", function (e) {
                // cancel scheduler rebind if error occurs
                e.preventDefault();

                var errorMessage = "";

                for (var error in args.errors) {
                    errorMessage += error + " args: " + args.errors[error].errors[0];
                    //alert(error + " args: " + args.errors[error].errors[0]);
                }

                //alert(errorMessage);
                ShowErrorMessage("header message", errorMessage);
            });
            args.sender.cancelChanges();
        }
    }
</script>


<!--modal popup per i messaggi--> 
<div id="modalPopup">
    <p id="lblMessage"></p>
</div>
<script type="text/javascript">
    //setto la modal popup
    $("#modalPopup").kendoWindow({
        resizable: false,
        draggable: false,
//        width: "300px",
//        height: "100px",
        minHeight: 100,
        minWidth: 300,
        modal: true,
        animation: {
            open: false
        },
        visible: false,
    });

    function ShowErrorMessage(headerMessage, message) {
        //imposto il messaggio di errore
        $("#lblMessage").text(message);

        $("#modalPopup").data("kendoWindow")
            .title(headerMessage)
            .center()
            .open();   
    }


    $(document).ready(function() {
        //apro la popup di messaggio
//        $("#modalPopup").data("kendoWindow")
//            .title("mio titolo")
//            .center()
//            .open();    
    });
</script>
<!--fine modal popup per i messaggi--> 

<script src="@Url.Content("~/Scripts/kendo/cultures/kendo.culture.it-IT.min.js")" type="text/javascript"></script>

<script type="text/javascript">
    //settiamo la cultura per il lingguaggio della tabella
    kendo.culture("it-IT");
</script>

<script type="text/javascript">

    $(function () {
        $("#people :checkbox").change(function (e) {
            var checked = $.map($("#people :checked"), function (checkbox) {
                return parseInt($(checkbox).val());
            });

            var filter = {
                logic: "or",
                filters: $.map(checked, function (value) {
                    return {
                        operator: "eq",
                        field: "OwnerID",
                        value: value
                    };
                })
            };

            var scheduler = $("#scheduler").data("kendoScheduler");

            scheduler.dataSource.filter(filter);
        });
    })
</script>

<style type="text/css" scoped>
    #scheduler {
        font-size: 14px;    
    }
    #team-schedule {
        /*background: url('@Url.Content("~/Content/web/scheduler/")team-schedule.png') transparent no-repeat;*/
        height: 115px;
        position: relative;
    }

    #people {
        /*background: url('@Url.Content("~/Content/web/scheduler/")scheduler-people.png') no-repeat;*/
        width: 345px;
        height: 115px;
        position: absolute;
        right: 0;
    }
    #alex {
        position: absolute;
        left: 4px;
        top: 81px;
    }
    #bob {
        position: absolute;
        left: 119px;
        top: 81px;
    }
    #charlie {
        position: absolute;
        left: 234px;
        top: 81px;
    }
</style>
